<template>
	<common-card class="portal_user_figure">
		<sw-chart :option="chartOption" auto-resize></sw-chart>
	</common-card>
</template>

<script lang="ts" setup>
import { useChart } from '@/hooks';
import commonCard from '../commonCard.vue';
import type { EChartsOption } from 'echarts';
defineOptions({ name: 'UserFigure' });
const chartData = ref([]);
const loading = ref(false);
const xAxis = ref<string[]>([]);
const colors = ['#246EFF', '#00B2FF', '#81E2FF', '#846BCE', '#86DF6C'];
const { chartOption } = useChart((isDark: EChartsOption) => {
	return {
		legend: {
			bottom: 0,
			data: ['正常值', '赵鹏']
		},
		radar: {
			radius: '64%',
			shape: 'circle',
			center: ['50%', '45%'],
			indicator: [
				{ name: '压力', max: 6500 },
				{ name: '活力', max: 16000 },
				{ name: '魅力', max: 30000 },
				{ name: '身心平衡', max: 38000 },
				{ name: '自控力', max: 52000 },
				{ name: '可疑度', max: 25000 },
				{ name: '攻击性', max: 30000 },
				{ name: '神经质', max: 52000 },
				{ name: '抑郁', max: 38000 },
				{ name: '焦虑', max: 36000 }
			]
		},
		series: [
			{
				name: 'Budget vs spending',
				type: 'radar',
				data: [
					{
						value: [4200, 3000, 20000, 35000, 50000, 18000, 4200, 3000, 20000, 35000],
						name: '正常值'
					},
					{
						value: [5000, 14000, 28000, 26000, 42000, 21000, 5000, 14000, 28000, 26000],
						name: '赵鹏'
					}
				]
			}
		]
	};
});
console.log(chartOption);
</script>

<style lang="scss" scoped>
.portal_user_figure {
	&:deep(.arco-card-body) {
		padding: 16px !important;
	}
}
</style>
